
<!-- Main Header Weather -->

<div class="main-header main-header-weather">
	<div class="content-bg-wrap bg-weather"></div>

	<div class="date-and-place">
		<div class="date">Saturday, March 26th</div>
		<div class="place">San Francisco, CA</div>
	</div>

	<div class="wethear-update">
		Updated: 20/10 6:32pm
		<svg class="olymp-weather-refresh-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-weather-refresh-icon"></use></svg>
	</div>
	<div class="container">
		<div class="row">
			<div class="m-auto col-lg-4 col-md-8 col-sm-12 col-12">
				<div class="wethear-content">
					<div class="wethear-now">
						<svg class="olymp-weather-partly-sunny-icon icon"><use xlink:href="svg-icons/sprites/icons-weather.svg#olymp-weather-partly-sunny-icon"></use></svg>

						<div class="temperature-sensor">64°F</div>
						<div class="max-min-temperature">
							<span>Low: 58°</span>
							<span>High: 76°</span>
						</div>
					</div>


					<div class="climate">Partly Sunny</div>

					<div class="wethear-now-description">
						<div>
							<svg class="olymp-weather-thermometer-icon icon"><use xlink:href="svg-icons/sprites/icons-weather.svg#olymp-weather-thermometer-icon"></use></svg>
							<div>Real Feel</div>
							<span>67°</span>
						</div>

						<div>
							<svg class="olymp-weather-rain-drops-icon icon"><use xlink:href="svg-icons/sprites/icons-weather.svg#olymp-weather-rain-drops-icon"></use></svg>
							<div>Chance of Rain</div>
							<span>5%</span>
						</div>

						<div>
							<svg class="olymp-weather-wind-icon-header icon"><use xlink:href="svg-icons/sprites/icons-weather.svg#olymp-weather-wind-icon-header"></use></svg>
							<div>Wind Speed</div>
							<span>20MPH</span>
						</div>
					</div>

				</div>
			</div>
		</div>
	</div>

	<img class="img-bottom" src="img/weather-bottom.png" alt="friends">
</div>

<!-- ... end Main Header Weather -->
